<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<title>平安车行汽车服务</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
	<header  class="all-ratings-header">
		<a href="javascript:history.go(-1)" class="return"></a>
		<h2 class="title">我的点评</h2>
	</header>

<!-- business start -->
	<div class="business my-ratings-wrapper">
		<ul class="business-list">
			<!-- business-item -->
			<li class="business-item">
				<a href="#">
					<div class="avatar"><img src="img/avatar.png" alt=""></div>
					<div class="text">
						<h3 class="name">车享家汽车养护中心车享家汽车养护中心</h3>
						<div class="star-warpper">
							<ul class="star-list">
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<!-- on 全星 -->
								<li class="star-item half"></li>
								<!-- half 半星 -->
								<li class="star-item off"></li>
								<!-- off 无星 -->
							</ul>
							<span class="score">4.5分</span>
						</div>
						<div class="text-bottom clearfix">
							<div class="brand-wrapper">
								<h4 class="title">主营品牌</h4>
								<ul class="brand-list">
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
								</ul>
							</div>
							<span class="distance">563m</span>
						</div>
					</div>
				</a>
				<!-- ratings start -->
				<div class="ratings all-ratings">
					<ul class="rating-list">
						<li class="rating-item">
							<ul class="small-star-list">
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<!-- on 全星 -->
								<li class="star-item half"></li>
								<!-- half 半星 -->
								<li class="star-item off"></li>
								<!-- off 无星 -->
							</ul>
							<p class="rating-text">车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。</p>
							<ul class="img-list clearfix">
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
							</ul>
						</li>
					</ul>
				</div>
				<div class="see-rating">
					<div class="title-wrapper">
						<span class="title">查看点评</span>
						<i class="icon"></i>
					</div>
				</div>
			</li>
			
			<!-- business-item -->
			<li class="business-item">
				<a href="#">
					<div class="avatar"><img src="img/avatar.png" alt=""></div>
					<div class="text">
						<h3 class="name">车享家汽车养护中心</h3>
						<div class="star-warpper">
							<ul class="star-list">
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<!-- on 全星 -->
								<li class="star-item half"></li>
								<!-- half 半星 -->
								<li class="star-item off"></li>
								<!-- off 无星 -->
							</ul>
							<span class="score">4.5分</span>
						</div>
						<div class="text-bottom clearfix">
							<div class="brand-wrapper">
								<h4 class="title">主营品牌</h4>
								<ul class="brand-list">
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
									<li class="brand-item"><img src="img/bt.png" alt=""></li>
								</ul>
							</div>
							<span class="distance">563m</span>
						</div>
					</div>
				</a>
				<!-- ratings start -->
				<div class="ratings all-ratings">
					<ul class="rating-list">
						<li class="rating-item">
							<ul class="small-star-list">
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<li class="star-item on"></li>
								<!-- on 全星 -->
								<li class="star-item half"></li>
								<!-- half 半星 -->
								<li class="star-item off"></li>
								<!-- off 无星 -->
							</ul>
							<p class="rating-text">车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。车子从内到外清洗得非常干净，服务态度很好，很满意。</p>
							<ul class="img-list clearfix">
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
								<li class="img-item"><img src="img/ratingimg.png" alt=""></li>
							</ul>
						</li>
					</ul>
				</div>
				<div class="see-rating">
					<div class="title-wrapper">
						<span class="title">查看点评</span>
						<i class="icon"></i>
					</div>
				</div>
			</li>
		</ul>
	</div>
<!-- business end -->

<!-- 以下为页面js部分 -->
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript">
		;(function() {
			$('.my-ratings-wrapper .see-rating').click(function() {
				if($(this).hasClass('on')) {
					$(this).removeClass('on');
				    $(this).parent().find('ul').removeClass('on');
				}else {
					$(this).addClass('on');
					$(this).parent().find('ul').addClass('on');
				}
			});
		})();
	   // 查看点评
	</script>
	<script>
		;(function() {
			function change() {
				var font = document.documentElement.clientWidth / 375 * 50;
				document.documentElement.style.fontSize = font + 'px';
			};
			window.addEventListener('resize', change, false);
			change();
		})();
		// rem 单位换算 *不可删除
    </script>
</body>
</html>